<template>
  <div class="adminbox">
    <el-table :data="adminData" border style="width: 100%">
      <el-table-column prop="._id" label="管理员编号"> </el-table-column>
      <el-table-column prop="username" label="管理员姓名"> </el-table-column>

      <el-table-column prop="images" label="管理员头像">
        <template slot-scope="scope">
          <el-image
            v-if="scope.row.images"
            style="width: 60px; height: 60px"
            :src="'http://localhost:3000/images/' + scope.row.images"
          ></el-image>
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">
          <el-button
            @click="handleEdit(scope.$index, scope.row._id)"
            type="text"
            size="small"
            >修改</el-button
          >
          <el-button
            @click="handleDelete(scope.row._id)"
            stype="text"
            size="small"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { createNamespacedHelpers } from "vuex";
const { mapActions, mapState, mapMutations } = createNamespacedHelpers(
  "admins"
);
export default {
  computed: {
    ...mapState([
      "adminData",
      "searchData",
      "pages",
      "currentPages",
      "pagedata",
      "total",
      "allPages",
    ]),
  },
  methods: {
    ...mapActions(["getAdmins", "delAdmins"]),
    ...mapMutations(["changePageData", "changeCurrentPages"]),
    //跳转到修改框
    handleEdit(index, row) {
      // console.log(index, row);
      this.$router.push("/System/AdminUpdate/" + row);
    },
    handleDelete(_id) {
      // console.log(_id, "删除");
      this.delAdmins({ _id });
    },
  },
  async created() {
    await this.getAdmins();
    // console.log(this.adminData, 11);
  },
};
</script>

<style lang="scss">
</style>